import React from "react";
import { imgPre } from "../../../../request/http";
import "./Goods.less";
import {Empty} from "antd-mobile"
import { Link } from "react-router-dom";
export default function Goods(props) {
  const { showGoods,n ,changeN} = props;
  var arr = ["热门商品", "打折商品", "全部商品"];
  
  return (
    <div className="goods">
      <div className="nav">
        {arr.map((item, index) => {
          return (
            <span key={item} className={index === n ? "active" : ""}
            onClick={()=>changeN(index)}
            >
              {item}
            </span>
          );
        })}
      </div>

     {
        showGoods.length>0? <div className="list">
         {showGoods.map((item) => {
           return (
             <Link to={"/detail/"+item.id} className="item" key={item.id}>
               <img src={imgPre + item.img} alt="" />
               <div>goodsname:{item.goodsname}</div>
             </Link>
           );
         })}
       </div>: <Empty description='暂无数据' />
     }
    </div>
  );
}
